<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:thSys="">
<div th:replace="admin/module/macros :: head('附件管理')"></div>
<body class="app sidebar-mini rtl">
	<main class="app-content">
	<div th:replace="admin/module/macros :: header"></div>
	<div th:replace="admin/module/macros :: sidebar"></div>
	<div class="app-title">
		<div>
			<h1>
				<i class="fa fa-dashboard"></i> 附件管理<a href="#" id="upload"
					class="btn">上传附件</a>
			</h1>
		</div>
		<ul class="app-breadcrumb breadcrumb">
			<li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
			<li class="breadcrumb-item"><a href="/admin/attachment">附件管理</a></li>
			<li class="breadcrumb-item">所有附件</li>
		</ul>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="tile" id="uploadInput" style="display: none;">
				<div class="file-loading">
					<input id="input-fas" autocomplete="off" name="file" type="file"
						class="file-loading" multiple>
				</div>
			</div>
			<div class="row">
				<th:block th:each="attachment : ${info.list}">
					<div class="col-lg-2 col-md-3 col-sm-6 col-6 div-thumbnail"
						th:onclick="'javascript:viewDetails('+${attachment.id}+')'">
						<a href="#"><img
							class="img-thumbnail img-fluid img-responsive"
							th:src="${attachment.pictureSmallPath}"></a>
					</div>
				</th:block>
			</div>
			<div th:replace="admin/module/macros :: pageAdminNav(${info})"></div>
		</div>
	</div>
	</main>
	<div th:replace="admin/module/macros :: comm"></div>
	<div th:replace="admin/module/macros :: bootstrapFileinput"></div>
	<script type="text/javascript" src="/static/plugins/layer/layer.js"></script>
	<script type="text/javascript">
		function viewDetails(id) {
			layer.open({
				type : 2,
				title : '附件详情',
				anim : 2,
				area : [ '90%', '90%' ],
				maxmin : true,
				content : "attachment/viewDetails/" + id
			});
		}

		$("#input-fas").fileinput(
				{
					theme : "fa",
					uploadUrl : "/admin/attachment/upload",
					language : 'zh',
					uploadAsync : true,
					allowedFileExtensions : [ 'jpg', 'gif', 'png', 'jpeg',
							'svg', 'psd' ],
					enctype : 'multipart/form-data',
					showClose : false
				}).on("filebatchuploadcomplete", function(event, files, extra) {
				 $.toast({
					text : "上传成功！",
					heading : '提示',
					icon : 'success',
					showHideTransition : 'fade',
					allowToastClose : true,
					hideAfter : 1000,
					stack : 1,
					position : 'top-center',
					textAlign : 'left',
					loader : true,
					loaderBg : '#ffffff',
					afterHidden : function() {
						window.location.reload();
					}
				}); 
		});
		$("#upload").click(function() {
			$("#uploadInput").slideToggle(400);
		});
	</script>
</body>
</html>